*{
    padding: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
}
.fl{
    float: left;
}
.fr{
    float:right;
}
.cl{
    clear: both;
}
.fontwhite{
    color:#fff;
}
.fontyellow{
    color: #ffd400;
}
.fontgray{
    color:#949bbb;
}
.fontred{
    color: #ff4c4c;
}
.fontgreen{
    color: #3dcc85;
}
.fontsm{
    font-size: 14px;
}
.fontxs{
    font-size: 13px;
}
.fontmd{
    font-size: 16px;
}
.fade-enter-active {
    transition: all 0.5s ease;
}
.fade-leave-active {
    transition: all .2s ease;
}
.fade-enter {
    transform: translateY(-10px);
    opacity: 0;
}
.fade-leave-active{
      transform: translateY(-10px);
    opacity: 0;
}
.topdown-enter-active {
    transition: all 0.5s ease;
}
.topdown-leave-active {
    transition: all 0.5s ease;
}
.topdown-enter {
    transform: translateY(-30px);
    opacity: 0;
}
.topdown-leave-active{
    transform: translateY(-30px);
    opacity: 0;
}
@deepblueshallow:white;
//定义比例系数
@sw:414px;
@ip5:0.7729;
@ip6:0.9058;
@ip6p:1;

/*ip5*/
@media(max-width:370px) {

}
/*ip6*/
@media (min-width:371px) and (max-width:410px) {
    
}
/*ip6p及以上*/
@media (min-width:411px) {
    
}
